<template>
	<view class="pd16_15">
		<radio-group>
			<view class="flex wrap space mt16">
				<view v-for="(item,index) in list" :key="index" :class="index > 1 ? 'mt16' : ''"
					class="box pd20_15 flex alcenter space" @click="clickNum(item.productId,index,item)"
					style="width: 330rpx; display: flex;flex-direction: column;">
					<view style="display: flex;justify-content: space-between;">
						<!-- <view class="ft16 cl-w ftw600">{{item.name}}</view>
						 -->
						<!-- <view class="ft16 cl-w ftw600" style="margin-right: 20px;"> -->
						<view style="margin-right: 20px;" v-for="(itn,ind) in item.subscriptionOfferDetails">
							{{itn.pricingPhases.pricingPhaseList[0].formattedPrice}}
						</view>
						<!-- </view> -->
						<view class="ft16 cl-w ftw600">
							<radio :value="item.productId" :checked="selectedProduct.productId == item.productId" />
						</view>

						<!-- </view> --> 
						<!-- subscriptionOfferDetails -->
						<!-- <view v-for="(iten,inds) in item.subscriptionOfferDetails" :key="inds" style="display: flex;">
						<view v-for="(ites,ins) in iten.pricingPhases.pricingPhaseList" :key="ins"
							style="display: flex;justify-content: space-between;">
							<view class="ft14 cl-main ftw600" style="margin-right: 20px;">{{item.name}}</view>
							<view class="ft16 cl-main ftw600" style="margin-right: 20px;">{{ites.formattedPrice}}</view>
						
									<radio :value="item.productId"
										:checked="selectedProduct.productId == item.productId" />
							

						</view> -->

					</view>
					<view class="ft16 cl-main ftw600" style="margin-top: 10px;">{{item.description}}</view>
				</view>
				<!-- <view v-for="(item,index) in moneyList" :key="index"  :class="index > 1 ? 'mt16' : ''" @click="clickNum(item.num,index)" class="box pd20_15 flex alcenter space" style="width: 330rpx;">
					<text class="ft14 cl-main ftw600">{{item.num}}</text>
					<radio :value="item.coupon+''" :checked="num == item.num"  :color="tempColor" />
				</view> -->
			</view>
		</radio-group>

		<view class="form-footer-h">
			<view class="form-footer form-footer-h">
				<view class="form-footer-main pd10_15">
					<button @click="paySuccess" class="btn-big" :style="getBtnStyle">{{$t('text.qd')}}</button>
				</view>
			</view>
		</view>
		<hFormAlert v-if="cancelShow" title="" name="cancel_desc" placeholder="请输入卡密卡号" @confirm="confirm"
			@cancel="cancel"></hFormAlert>
		<dialog-couponshare v-if="showCouponInvite" @closed="closedInvite"></dialog-couponshare>
	</view>
</template>

<script>
	import hFormAlert from '@/components/h-form-alert/h-form-alert.vue';
	var googlePay = uni.requireNativePlugin('sn-googlepay5');
	export default {
		components: {
			hFormAlert
		},
		data() {
			return {
				selectedProduct: {

				},
				list: [],
				num: '',
				moneyList: [],
				numa: '',
				userinfo: '',
				paysj: '',
				showCouponInvite: false,
				cancelShow: false,
				isConnected: false,
				offerToken: ""
			}
		},
		computed: {
			getCoupon() {
				for (var a in this.moneyList) {
					if (this.moneyList[a].num == this.num) {
						return this.moneyList[a].coupon;
					}
				}
				return 0;
			}
		},
		onLoad() {
			this.paysja()
			googlePay.init({
				autoReconnect: true, // 是否自动重连(插件实现)
				enableAutoServiceReconnection: true, //是否自动重连（8.0+支持）
				enableExternalOffer: true, // 是否启用外部优惠
				enableAlternativeBillingOnly: true //
			}, (e) => {
				if (e.code == 0) {
					this.isConnected = true;
					// 初始化成功
					console.log(e, 'ee');
					var pId = ['vip_all_1001'];
					googlePay.querySku({
							subs: pId
						},
						(e) => {
							if (e.code == 0) {
								this.list=e.list
								console.log('querySku', e.list);
								if (e.list.length > 0) {
									var pd = e.list[0];
									
									if (pd.subscriptionOfferDetails && pd.subscriptionOfferDetails.length >
										0) {
										this.offerToken = pd.subscriptionOfferDetails[0].offerToken;
									}
									
								} else {
									console.log('未查询到产品');
								}
							} else {
								//查询失败
								console.log('querySku fail', e);
							}
						}
					);

				} else {
					this.isConnected = false;
					// 初始化失败
				}
			});
		},
		onShareAppMessage(e) {

		},
		onShareTimeline(e) {

		},
		methods: {
			changeNum(e) {
				console.log(e);
				this.num = e.detail.value;
			},
			clickNum(value, index, item) {
				console.log('item',item);
				this.selectedProduct.productId = value;
				this.selectedProduct.allVAalue = item //所选参数
				// this.numa = this.moneyList[index].coupon
				this.numa='16.99'
			},
			async paysja() {
				//this.showCouponInvite = true;
				let data = {};
				data.token = uni.getStorageSync("userinfo").token;
				data.uid = uni.getStorageSync("userinfo").id;
				uni.request({
					url: this.configs.webUrl + '/api/user/paysj',
					data: data,
					success: res => {
						if (res.data.code == 1) {
							this.moneyList = res.data.data
						} else {}
					},
					fail: (data, code) => {
						//console.log('fail' + JSON.stringify(data));
					}
				});
			},

			paySuccess() {
				console.log(this.selectedProduct, 'this.num');
				let that=this
				let data = {};
				data.token = uni.getStorageSync("userinfo").token;
				data.uid = uni.getStorageSync("userinfo").id;
				data.num = this.numa;
				console.log('data---',data);
				googlePay.pay({
						productId: this.selectedProduct.productId, // 产品id
						offerToken: this.offerToken
					},
					(e) => {
						// console.log('pay result', e);
						let restunt=e
						console.log('---',restunt.data);
						if (e.code == 0) {
							console.log('1---1',e);
							googlePay.acknowledge({
									original: restunt.data[0].original,
									signature: restunt.data[0].signature
								},
								(e) => {
									console.log('consume result', e);
								
									// if(e.code==0){
										that.$httpas.post2({
											data: {
												do: 'hyk',
												op: 'add',
												eee:JSON.stringify(e),
												money:data.num,
												allID: JSON.stringify(that.selectedProduct.allVAalue),
												ordersn:restunt.data[0].original.orderId,
											},
											success: res => {
												console.log('res',res)
												if(res.pay_status==1){
													uni.navigateBack();
												}
												// uni.showToast({
												// 	title: this.$t('toast.pay.success'),
												// 	icon: 'none'
												// });
												
												  // 
											}
											
										})
									// }
							
								
								}
							);
						} else {

						}
					}
				);
				//this.showCouponInvite = true;
				// let data = {};
				// data.token = uni.getStorageSync("userinfo").token;
				// data.uid = uni.getStorageSync("userinfo").id;
				// data.num = this.numa;
				// uni.request({
				// 	url: this.configs.webUrl+'/api/user/vipsj',
				// 	data: data,
				// 	success: res =>{
				// 		if(res.data.code==1){
				// 			uni.showModal({
				// 				title: this.$t('play.win'),
				// 				content: res.data.msg,
				// 				showCancel: false,
				// 				confirmText: this.$t('text.qd'),
				// 				success: function (res) {
				// 					if (res.confirm) {
				// 						uni.navigateBack();
				// 					} else if (res.cancel) {

				// 					}
				// 				}
				// 			});
				// 		}else{
				// 			if(res.data.msg=='余额不足'){
				// 				uni.showModal({
				// 					title: this.$t('play.wins'),
				// 					content: res.data.msg,
				// 					showCancel: true,
				// 					confirmText: this.$t('text.recharge'),
				// 					success: function (res) {
				// 						if (res.confirm) {
				// 							uni.navigateTo({
				// 								url:"/pages/client/vipcard/recharge"
				// 							})
				// 						} else if (res.cancel) {
				// 							//uni.navigateBack();
				// 						}
				// 					}
				// 				});
				// 			}else{
				// 				uni.showToast({ title: res.data.msg,icon:"none" });
				// 			}

				// 		}
				// 	},
				// 	fail: (data, code) => {
				// 		//console.log('fail' + JSON.stringify(data));
				// 	}
				// });
			},
			closedInvite() {
				this.showCouponInvite = false;
				let pages = getCurrentPages();
				uni.navigateBack({
					delta: pages.length
				});
			}
		}
	}
</script>

<style>
	.tag-coupon {
		width: 100%;
		height: 80rpx;
		border-radius: 16rpx;
		text-align: center;
		line-height: 80rpx;
		font-size: 28rpx;
	}

	.recharge-header {
		height: 240rpx;
		width: 100%;
		position: relative;
	}

	.recharge-header image {
		width: 100%;
		height: 240rpx;
	}

	.recharge-header .main {
		position: absolute;
		width: 100%;
		height: 240rpx;
		left: 0;
		top: 0;
	}

	.tdadf {
		border: 1px solid #f8f8f8;
		padding: 10px 5px;
		background: #ffffff;
		border-radius: 8px;
		box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.04);
	}
</style>